<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <link rel="stylesheet" href="/node_modules/bootstrap/dist/css/bootstrap.css">
    <link rel="stylesheet" href="/public/css/login.css">
</head>

<body>
<div class="main">
    <div class="header">
        <a href="/">
            <img src="/public/img/logo3.png" alt="">
        </a>
        <h1>用户登录</h1>
    </div>
    <form id="login_form">
        <div class="form-group">
            <label>邮箱</label>
            <input type="email" class="form-control" name="email" placeholder="Email" autofocus>
        </div>
        <div class="form-group">
            <label>密码</label>
            <a class="pull-right" href="">忘记密码？</a>
            <input type="password" class="form-control" name="password" placeholder="Password">
        </div>
        <div class="checkbox">
            <label>
                <input type="checkbox">记住我
            </label>
        </div>
        <button type="submit" class="btn btn-success btn-block">登录</button>
    </form>
    <div class="message">
        <p>没有账号? <a href="/register">点击创建</a>.</p>
    </div>
</div>
<script src="/node_modules/jquery/dist/jquery.js"></script>
<script>
    $('#login_form').on('submit', function (e) {
        e.preventDefault()
        var formData = $(this).serialize()
        console.log(formData)
        $.ajax({
            url: '/login',
            type: 'post',
            data: formData,
            dataType: 'text',
            success: function (data) {
                console.log(data);
                // window.alert('注册成功！')
                // 服务端重定向针对异步请求无效
                window.location.href = '/'
            },
            error: data => {
                window.alert(data.responseText)
            }
        })
    })
</script>
</body>

</html>
